<template>
    <div>
      <!-- 头部 -->
      <div v-if="!showLoading">
        <header-app :notice_msg="notice_msg"></header-app>

        <mu-tabs :value.sync="active1" color="#fff" indicator-color="#2196f3" full-width class="mall tab_choose">
         <!-- <router-link v-bind:to="{path:'/goods'}">-->
            <mu-tab @click="toGoods">商品</mu-tab>
          <!--</router-link>-->
         <!-- <router-link v-bind:to="{path:'/shopInfo'}">-->
            <mu-tab @click="toShopInfo">商家</mu-tab>
          <!--</router-link>-->

        </mu-tabs>
      </div>
      <!-- 头部 -->
      <keep-alive>
        <router-view  v-on:childByValue="childByValue"></router-view>
      </keep-alive>
      <footer-app :type=1></footer-app>
    </div>
</template>

<script>

  import headerApp from './components/Header'

  import BScroll from 'better-scroll'

  import footerApp from './../public_components/foot'
  import a from './../../assets/img/01.jpg'
  import b from './../../assets/img/02.jpg'
  import c from './../../assets/img/03.jpg'
  import e from './../../assets/img/04.jpg'
    export default {
        name: "mall",
        mounted(){
          this.checkLogin();
          this.initContentH();
          this.initNotice();
          /*this.initShopNotice()*/
        },
        data(){
          return{
            showLoading:true,
            active1: 0,
            listImg:[],
            total:0,
            seller: {},
            menu_wrapper_status:0,
            productList:[],
            notice_msg:''
          }
        },
        created() {

        },
        components:{
          headerApp,footerApp
        },
        methods:{
          toGoods(){
            this.$router.push('/goods');
          },
          toShopInfo(){
            this.$router.push('/shopInfo');
          },
          initContentH() {
            var self = this
            //获取页面的高度
            var hq = $(window).height();
            var h1 = $('.head').outerHeight();
            var h2 = $('.swiper-container-horizontal').height();
            var f = $('.foot').outerHeight();
            var height = hq - h1 - h2 - f;
            $('.content').css('height', height + 'px');
          },
          initNotice(){
            this.yesS.getNotice(
              this.$comParams()
            ).then(res => {
              this.notice_msg = res.data.msg
            })
          },

          childByValue: function (childValue) {
            this.showLoading = childValue
          },

        }
    }

</script>

<style lang="stylus" rel="stylesheet/stylus">
  /*@import "assets/stylus/mixin.styl";*/

  .mu-tab-wrapper{
    min-height: 42px !important;
  }
  .tab{
    display: flex;
    justify-content: space-around;
    padding: 0.5rem;
    border-bottom 1px solid #b7b5b5;
  }
  .head{
    height: 50px;
    width: 90%;
    border: 1px solid red;
  }
  .content{
    width: 100%;
    overflow: hidden;
   /* overflow-y: scroll;*/
  }
  .total{
    position: fixed;
    left: 3rem;
    bottom: 5rem;
    z-index: 99999;
    background: salmon;
  }
  a{
    color #949292!important;
  }

  .tab_change_pos{
    position:fixed!important;
    top: 0;
    left: 0;
    right: 0;
  }

  .mall .mu-tab-active{
    color:#0a8ddf
  }

  .mall{
    color: black
  }


</style>
